@include('admin.public.head')

<!-- jQuery Validation plugin javascript-->
<script src="{{ URL::asset('./admin/js/plugins/validate/jquery.validate.min.js') }}"></script>
<script src="{{ URL::asset('./admin/js/plugins/validate/messages_zh.min.js') }}"></script>

<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">

    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">

                <div class="ibox-title">
                    <h5>新增時段</h5>
                </div>

                <div class="ibox-content">

                    <form  class="form-horizontal" id="myForm">

                        <div class="form-group">
                            <label class="col-sm-2 control-label">周期：</label>
                            <div class="col-sm-4">
                                <select class="form-control" name="week" >
                                    <option value="" >请选择周期</option>
                                    @foreach($week_lists as $k=>$v)
                                        <option value="{{$k}}" @if($week === $v) selected="selected" @endif>{{$v}}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="hr-line-dashed"></div>


                        <div class="form-group">
                            <label class="col-sm-2 control-label">开始时间</label>
                            <div class="col-sm-2">
                                <select class="form-control" name="start_hour" id="startHour">
                                    <option value=""></option>
                                </select>
                            </div>

                            <div class="col-sm-2">
                                <select class="form-control" name="start_minute" id="startMinute">
                                    <option value=""></option>
                                </select>
                            </div>
                        </div>
                        <div class="hr-line-dashed"></div>

                        <div class="form-group">
                            <label class="col-sm-2 control-label">结束时间</label>
                            <div class="col-sm-2">
                                <select class="form-control" name="end_hour" id="endHour">
                                    <option value=""></option>
                                </select>
                            </div>

                            <div class="col-sm-2">
                                <select class="form-control" name="end_minute" id="endMinute">
                                    <option value=""></option>
                                </select>
                            </div>
                        </div>
                        <div class="hr-line-dashed"></div>

                        <div class="form-group">
                            <div class="col-sm-4 col-sm-offset-2">
                                <input type="hidden" name="id" value="{{$id??0}}">
                                <button type="submit" class="btn btn-primary do">操作</button>
                                <a href="/time" type="reset" class="btn btn-primary">返回時間段列表</a>
                            </div>

                        </div>
                    </form>
                </div>
            </div>
        </div>

    </div>
</div>
<script>

    var time_start_hour = "{{$result['time_start_hour']??''}}";
    var time_end_hour = "{{$result['time_end_hour']??''}}";
    var time_start_minute = "{{$result['time_start_minute']??''}}";
    var time_end_minute = "{{$result['time_end_minute']??''}}";

    getTime();

    function getTime() {

        var start_html = "<option value=''>时</option>";
        var end_html = "<option value=''>时</option>";

        for (var i = 0; i < 24; i++) {

            if (i < 10) {
                start_html += "<option value='" + '0' + i + "' ";

                var option_select = '0'+i;

                if(option_select == time_start_hour)start_html += "selected='selected'";

                start_html += ">" + '0' + i + "</option>";
            } else {
                start_html += "<option value='" + i + "'";

                if(i == time_start_hour)start_html += "selected='selected'";

                start_html += ">" + i + "</option>";
            }

            if (i < 10) {
                end_html += "<option value='" + '0' + i + "' ";

                var option_select = '0'+i;

                if(option_select == time_end_hour)end_html += "selected='selected'";

                end_html += ">" + '0' + i + "</option>";
            } else {
                end_html += "<option value='" + i + "'";

                if(i == time_end_hour)end_html += "selected='selected'";

                end_html += ">" + i + "</option>";
            }

        }

        $('#startHour').html(start_html);
        $('#endHour').html(end_html);

        var start_html = "<option value=''>分</option>";
        var option_select = '';

        for (var i = 0; i < 60; i++) {
            if (i < 10) {
                start_html += "<option value='" + '0' + i + "' ";

                var option_select = '0'+i;

                if(option_select == time_start_minute)start_html += "selected='selected'";

                start_html += ">" + '0' + i + "</option>";
            } else {
                start_html += "<option value='" + i + "' ";

                if(i == time_start_minute)start_html += "selected='selected'";

                start_html += ">" + i + "</option>";
            }
        }

        var end_html = "<option value=''>分</option>";
        var option_select = '';

        for (var i = 0; i < 60; i++) {
            if (i < 10) {
                end_html += "<option value='" + '0' + i + "' ";

                var option_select = '0'+i;

                if(option_select == time_end_minute)end_html += "selected='selected'";

                end_html += ">" + '0' + i + "</option>";
            } else {
                end_html += "<option value='" + i + "' ";

                if(i == time_end_minute)end_html += "selected='selected'";

                end_html += ">" + i + "</option>";
            }
        }


        $('#startMinute').html(start_html);
        $('#endMinute').html(end_html);

    }

    $().ready(function () {
        // 在键盘按下并释放及提交后验证提交表单
        $("#myForm").validate({
            rules: {
                name: 'required',
                start_hour: 'required',
                start_minute: 'required',
                end_hour: 'required',
                end_minute: 'required',
            },
            messages: {
                name: '请填写时段名称',
                start_hour: '请选择小时',
                start_minute: '请选择分钟',
                end_hour: '请选择小时',
                end_minute: '请选择分钟',
            }
        })
    });

    $('.do').click(function(){

        var form = new FormData();

        var start_hour = $('select[name="start_hour"] option:selected').val();
        var week = $('select[name="week"] option:selected').val();
        var start_minute = $('select[name="start_minute"] option:selected').val();
        var end_hour = $('select[name="end_hour"] option:selected').val();
        var end_minute = $('select[name="end_minute"] option:selected').val();
        var id = $('input[name="id"]').val();

        if(start_hour == '' || start_minute == ''){
            layer.msg('填寫開始時間!');
            return false;
        }

        if(end_hour == '' || end_minute == ''){
            layer.msg('填寫結束時間!');
            return false;
        }

        var time_start = start_hour+':'+start_minute;
        var time_end = end_hour+':'+end_minute;

        form.append("time_start", time_start);
        form.append("time_end", time_end);
        form.append("week", week);
        form.append("id", id);

        $.ajax({
            type: 'POST',
            url: '/time_do' ,
            dataType:"json",   //返回格式为json
            data: form ,
            processData: false,
            contentType: false,
            success:function(data){

                if(data.status == '1') {
                    var swal_json = {
                        title: data.message,
                        type: "success"
                    }

                    swal(swal_json, function (isConfirm) {
                        window.location.reload();
                    });

                }else{
                    var swal_json = {
                        title: data.message,
                        type: "error"
                    }

                    swal(swal_json, function (isConfirm) {

                    });
                }
            }
        });

        return false;
    });
</script>

</body>
</html>
